<script setup lang="ts">
import { useRouter, useRoute } from "vue-router";
import { typeList } from '@/utils'

const router = useRouter();
const route = useRoute();

const back = () => {
  router.push("/home");
};
const setType = (item) => {
    return typeList.filter((i) => { return item === i.key})[0]?.name
}
</script>

<template>
  <div class="my">
    <div class="my-top">
      <div class="my-nav">
        <img src="@/assets/toPrev.png" alt="" />
        <!-- <el-icon @click="toPrev()"><ArrowLeft /></el-icon> -->
        <div class="my-item">提交成功</div>
      </div>
      <div class="flex_center">
           <el-icon class="icon"><CircleCheckFilled /></el-icon>
      <div class="text_center">查询提交成功</div>
      <div class="text_center fz13">您的{{setType($route.query.key)}}查询已提交，我们会尽快审核</div>
      <div class="text_center">
          <el-button type="info" @click="back()">返回首页</el-button>
      </div>

      </div>
    </div>
  </div>
</template>

<style scoped>

.my-nav {
  position: relative;
  padding-top: 25px;
  margin-bottom: 12px;
}
.my-nav img {
  position: absolute;
  left: 16px;
}
.my-top {
  padding-bottom: 16px;
}
.my-top img {
  width: 10px;
  display: inline-block;
  padding-top: 25px;
  padding-left: 5px;
  top: 0;
}
.my-item {
  text-align: center;
  width: 100%;
}
.text_center{
    text-align: center;
    white-space: nowrap;
    margin: 10px 0;
}
.flex_center{
   position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 50%;
    transform: translate(-50%, -50%);
}
.flex_center .el-button{
        width: 80%;
    border-radius: 20px;
    background: #F1F1F1;
    color: #2863FD;
    border: none;
    margin-top: 10px;
}
.fz13{
    font-size: 13px;
    color: #999999;
}
.icon{
  font-size: 78px;
    text-align: center;
    width: 100%;
    color: #42B761;
}
</style>
